
import React from 'react';
import { Button, message } from "antd";
import Controller, { IFileItem } from "Controller";
import { Element } from "components/Three";
import getGLTFLoader from 'tools/loaders/getGLTFLoader';
import { GLTF } from 'components/Three/Controller/State/Element';

export default function AddGlb(props: { record: IFileItem }) {

    const { record } = props;

    const onClick = React.useCallback(async () => {
        try {
            const gltf = await getGLTFLoader(record.path);
            const threeController = Controller.instance.state.threeController;
            const controls = threeController.state.controls;
            const element = new Element('gltf', gltf.scene.uuid, new GLTF(gltf, record.path));
            
            gltf.scene.position.set(controls?.target.x || 0, controls?.target.y || 0, controls?.target.z || 0);

            threeController.sceneAdd(element);
            threeController.run(async s => s.selectedElementUuid = element.uuid);
        } catch (error) {
            message.error('模型加载失败');
            console.error(error)
        }
    }, [record])

    return (
        <Button type="text" onClick={onClick} >添加</Button>
    )
}